import { Button, Card, Checkbox, Form, message, Modal, Radio, Row, Col, Select, Input, InputNumber, Steps } from "antd";
import { connect } from "dva";
import React, { PureComponent } from "react";
import { transferOption } from "@/utils/common";
import styles from "./index.less";
const FormItem = Form.Item;
const { Step } = Steps;

@connect((state) => ({
  menu: state.menu,
  creditCar: state.creditCar,
}))
export default class configModal extends PureComponent {
  formRef = React.createRef();
  state = {
    modalVisible: false,
  };

 componentDidMount() {
  this.props.onRef(this)
  }
  showData = async (data) => {
    await this.setState({
      modalVisible: true,
    });
    this.formRef.current.setFieldsValue({
      whStorageTimeLimit: data?.whStorageTimeLimit || '2',
      storageTimeLimit: data?.storageTimeLimit || '7',
      moveTimeLimit: data?.moveTimeLimit || '1',
    });
  }
  ok = (e) => {
    const { dispatch } = this.props;
    e.preventDefault();
    this.formRef.current.validateFields().then(values => {
      const obj = values;
     console.log('valus', values)
     dispatch({
      type: 'creditCar/postObjWithRes',
      payload: {
        url: '/mscreditbusiness/vehicle/credit/move/config', 
        ...values,
      },
      callback: (response) => {
        if (response.statusCode == '0') {
          message.success('设置成功');
        } 
        this.setState({ modalVisible: false });
      },
    });
    });
   };
  
  close = () => {
    this.formRef.current.resetFields();
    this.setState({ modalVisible: false });
  };
  checkTime = (rule, value) => {
    const { menu: { pwdStrategy: { pwdStrategy, pwdStrategyDesc } } } = this.props;
    if (value) {
        const regex = new RegExp(pwdStrategy);
        if (!regex.test(value)) {
            return Promise.reject(`请输入正确的密码，${pwdStrategyDesc}`);
        }
    } else {
        return Promise.reject('请输入密码');
    }
    return Promise.resolve();
  }
  renderSimpleForm() {
    const {modalVisible} = this.state;
    const footer = (
      <div>
        <Button  onClick={this.ok} type="primary">
          确定
        </Button>
        <Button onClick={this.close}>取消</Button>
      </div>
    );
    return (
      <div>
      <Modal
        footer={footer}
        title="通用配置"
        visible={modalVisible}
        onCancel={this.close}
        style={{ top: 50}}
      >
        <div style={{ marginLeft: 30 }}>
        <div>
       <Form   ref={this.formRef} onSubmit={this.handleSubmit}>
       <Form.Item label="武汉地区入库时限"  required>
         <FormItem 
            name={"whStorageTimeLimit"}
            rules={[{ required: true, message: '请填写' },
            {
              pattern: /^[+]{0,1}([1-9][0-9]{0,})$|^[+]{0,1}([1-9][0-9]{0,}\.\d+)$|^[+]{0,1}([0]\.(?!0+$)\d{1,})$/,
              message: "请填写大于0的数字"
              }]}
            noStyle 
            >
            <InputNumber/>
         </FormItem>
         <span className="ant-form-text" style={{marginLeft: 8,}}>天</span>
        </Form.Item> 
        <Form.Item label="非武汉地区入库时限"  required>
         <FormItem 
            name={"storageTimeLimit"}
            rules={[{ required: true, message: '请填写' },
            {
              pattern: /^[+]{0,1}([1-9][0-9]{0,})$|^[+]{0,1}([1-9][0-9]{0,}\.\d+)$|^[+]{0,1}([0]\.(?!0+$)\d{1,})$/,
              message: "请填写大于0的数字"
              }]}
            noStyle 
            >
            <InputNumber/>
         </FormItem>
         <span className="ant-form-text" style={{marginLeft: 8,}}>天</span>
        </Form.Item>
        <Form.Item label="默认移车时限"  required>
         <FormItem 
            name={"moveTimeLimit"}
            rules={[
              { required: true, message: '请填写' },
              {
              pattern: /^[+]{0,1}([1-9][0-9]{0,})$|^[+]{0,1}([1-9][0-9]{0,}\.\d+)$|^[+]{0,1}([0]\.(?!0+$)\d{1,})$/,
              message: "请填写大于0的数字"
              }]}
            noStyle 
            >
            <InputNumber/>
         </FormItem>
         <span className="ant-form-text" style={{marginLeft: 8,}}>天</span>
        </Form.Item>  
       </Form>
       </div>
       <div style={{ color: 'red', marginTop: 10, fontSize: 'small' }}>
        注：入库、移车时仅限授信类型为经销商的车辆
       </div>
       </div>
      </Modal>
      </div>
    );
  }

  render() {
    return this.renderSimpleForm();
  }
}
